<template>
    <div class="dialogBody">
        <el-dialog v-bind="attrs" title="标题" width="30%" class="dialog">
            <!-- 内容区域 -->
            <template #footer>
            <span class="dialog-footer">
                <el-button type="primary" color="#1A6BE3" @click="dialog.confirm()">确认</el-button>
                <el-button @click="dialog.cencel()">取消</el-button>
            </span>
            </template>
        </el-dialog>
    </div>
</template>
<script setup>
const attrs = useAttrs();
const emits = defineEmits()
const dialog = reactive({
    cencel(){
        emits('cencel')
    },
    async confirm(){
        emits('confirm')
    }
})
</script>
<style scoped lang="less">
.dialogBody{
    width: 100%;
    height: 100%;
    :deep(.dialog){
        border-radius: 15px;
    }
    :deep(.el-dialog__header){
        border-bottom: solid 1px #cccc;
    }
    .dialog-footer{
        display: flex;
        justify-content: center;
    }
}
</style>